<template>
  <div :class='s.wrap' @click='onClick' :style='{color: color, borderColor: color}'>
    <slot></slot>
  </div>
</template>

<script>
export default {
  props: {
    color: String
  },
  methods: {
    onClick () {
      this.$emit('click')
    }
  }
}
</script>
<style lang='less' module='s'>
.wrap{
  width: 36px;
  height: 36px;
  border-style: solid;
  border-width: 1px;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: flex;
  margin-right: 3px;
  i{font-size: 24px;}
}
</style>